<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0" />
		<!--ios是否运行创建快捷启动方式-->
		<meta content="yes" name="apple-mobile-web-app-capable">
		<!--ios顶部通知栏的样式 黑色-->
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<!--遇到数字不让转成电话号码格式-->
		<meta content="telephone=no" name="format-detection">
		<title>新用户注册</title>
		<link rel="stylesheet" href="assets/mui/css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="common/css/base.css" />
		<link rel="stylesheet" type="text/css" href="common/css/animate.css" />
		<link rel="stylesheet" href="assets/font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css" />
		<link rel="stylesheet" type="text/css" href="css/u-templeto-three.css" />
		<!--<link rel="stylesheet" type="text/css" href="css/normalize.css" />
		<link rel="stylesheet" type="text/css" href="css/lrtk.css" />-->
		<style type="text/css">
			.circle_bg {
				border-radius: 50%;
				border: 1px solid white;
				width: 4rem;
				height: 4rem;
				color: white;
				overflow: hidden;
				position: relative;
				left: 50%;
				margin-left: -2rem;
				box-shadow: 0 0 30px white;
				animation:rotateIn 1.5s forwards ;
				background-color: rgba(0,0,0,0.2);
				font-size: 0.4rem;
			}
			.circle_bg .contain{
				width: 1rem;
				height: 1rem;
				text-align: center;
				line-height: 1rem;
				font-size: 0.5rem;
			}
			.circle_bg .box1{
				position: absolute;
				left: 1.25rem;
				top: 0.28rem;
			}
			.circle_bg .box2{
				position: absolute;
				left: 2.6rem;
				top: 0.88rem;
			}
			.circle_bg .box3{
				position: absolute;
				left: 2.4rem;
				top: 2.28rem;
			}
			.circle_bg .box4{
				position: absolute;
				left: 1rem;
				top: 2.6rem;
			}
			.circle_bg .box5{
				position: absolute;
				left: 0.2rem;
				top: 1.3rem;
			}
			.circle_bg>.part {
				width: 58%;
				height: 58%;
				position: absolute;
				left: 50%;
				top: 50%;
				transform-origin: 0% 0%;
				padding: 0.5rem 0.6rem;
				box-sizing: border-box;
				border: 1px solid white;
				box-shadow: 0 0 5px white;
			}
			.pos01 {
				transform: rotate(80deg) skewX(20deg);
			}
			
			.pos02 {
				transform: rotate(8deg) skewX(20deg);
			}
			
			.pos03 {
				transform: rotate(-64deg) skewX(20deg);
			}
			
			.pos04 {
				transform: rotate(224deg) skewX(20deg);
			}
			
			.pos05 {
				transform: rotate(152deg) skewX(20deg);
			}
			
			
		</style>
	</head>

	<body>

		<div class="main-bg">
			<div class="mui-content mui-scroll-wrapper">
				<div class="mui-scroll" style="margin-top: 1rem;">
					<div class="useHeader" id="useHeader">
						<div><img src="img/head.png" /></div>
						<p>微微微</p>
						<p>苏州绿叶集团</p>
						<p>高级总监</p>
					</div>

					<!--轮播信息-->
					<div class="circle_bg" id="slide">
						<!--<div class="part bg-blue pos01"></div>
						<div class="part bg-red pos02"></div>
						<div class="part bg-green pos03"></div>
						<div class="part bg-pink pos04"></div>
						<div class="part bg-yellow pos05"></div>
						
						<div class="contain box1 fa fa-address-book"></div>
						<div class="contain box2 fa fa-address-book"></div>
						<div class="contain box3 fa fa-address-book"></div>
						<div class="contain box4 fa fa-address-book"></div>
						<div class="contain box5 fa fa-address-book"></div>-->
					</div>
				</div>
			</div>

		</div>

		<script src="js/jquery-3.1.0.min.js"></script>
		<script src="assets/artTemplate/template-native.js"></script>
		<script src="js/remstyle.js"></script>
		<script src="common/js/common.js"></script>
		<script src="assets/mui/js/mui.min.js"></script>
		<!--<script src="js/modernizr-2.6.2.min.js"></script>
		<script src="js/polyfills.js"></script>
		<script src="js/lrtk.js"></script>-->

	</body>

</html>